<template>
    <el-table :data="students" style="width: 100%">
        <el-table-column label="姓名" prop="name"> </el-table-column>
        <el-table-column label="性别" prop="gender"> </el-table-column>
        <el-table-column label="年龄" prop="age"> </el-table-column>
        <el-table-column label="操作">
            <template slot-scope="scope">
                <el-button
                    size="mini"
                    @click="handleUpdate(scope.row._id)"
                    >编辑</el-button
                >
                <el-button
                    size="mini"
                    type="danger"
                    @click="handleDelete(scope.row._id)"
                    >删除</el-button
                >
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
import { remove, findById } from "../../services/student";
import {mapMutations,mapActions} from 'vuex';
export default {
    props: ["students"],
    methods: {
        handleDelete(id) {
            this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(async () => {
                await remove(id);
                this.$emit("show");
            });
        },
        async handleUpdate(id) {
            // let student = await findById(id);
            // this.$emit("setUpdateVisible",true);
            this.setUpdateVisible(true);
            this.setStudent(id);
            // this.$emit("setStudent", student);

        },
        ...mapMutations('student',['setUpdateVisible']),
        ...mapActions('student',['setStudent'])
    },
};
</script>

<style>
</style>